<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <title>诊间小屏</title>
    <link rel="stylesheet" type="text/css" href="style/room.css">
    <script type="text/javascript" src="js/common.js"></script>
    <script>

        window.onload = function () {
            var params = Utils.getQueryParams(window.location.href)
            if (params) {
                if (params.server_url) {
                    Utils.baseUrl = params.server_url
                }
                if (params.content) {
                    document.querySelector('div.yy-screen-content_person').innerHTML = decodeURIComponent(params.content)
                }
                if (params.customer_title) {
                    document.querySelector('div.yy-screen-header_customer div.customer-title').innerHTML = decodeURIComponent(params.customer_title)
                }
                if (params.customer_logo) {
                    document.querySelector('div.yy-screen-header_customer div.customer-logo > img').setAttribute("src", decodeURIComponent(params.customer))
                    document.querySelector('div.yy-screen-header_customer div.customer-logo').style.display = ''
                } else {
                    document.querySelector('div.yy-screen-header_customer div.customer-logo').style.display = 'none'
                }
            }

            DateTimeRender.render(null, function (dateArr, week) {
                document.querySelector('.yy-screen-header_time > .yy-screen-header_time-date > div:first-child').innerText = week
                document.querySelector('.yy-screen-header_time > .yy-screen-header_time-date > div:nth-child(2)').innerText = dateArr[1]+'月'+dateArr[2]+'日'
                document.querySelector('.yy-screen-header_time > .yy-screen-header_time-hour').innerText = dateArr.slice(3).join(":")
            })
            Utils.resetFontSize(1080, 1920)
            window.onresize = function () {
                Utils.resetFontSize(1080, 1920)
            }
        }
    </script>
</head>
<body>
    <div style="display: flex; flex-direction: column; min-height: 100%; width: 100%;">
        <div class="yy-screen-header">
            <div class="yy-screen-header_customer">
                <div class="customer-logo" style="width: 0.9rem;">
                    <img style="width:100%;" />
                </div>
                <div class="customer-title">
                </div>
            </div>
            <div class="yy-screen-header_time">
                <div class="yy-screen-header_time-date">
                    <div></div>
                    <div style="font-size: 0.22rem;"></div>
                </div>
                <div class="yy-screen-header_time-hour" style="display: flex; align-items: center;font-size: 0.4rem;margin-left: 0.05rem;"></div>
            </div>
        </div>
        <div class="yy-screen-content">
            <div class="yy-screen-content-list">
                <div class="yy-screen-content_person" style="flex: 2;align-items: center;justify-content: center; font-size: 1.5rem;text-align: center;">
                </div>
                <div style="display: flex;flex-direction: column;min-height: 0;flex: 1;">
                    <div class="yy-screen-content_row-cell" style="padding: 0.1rem;">
                        <video id="video" width="100%" height="100%" controls autoplay muted loop>
                        </video>
                    </div>
                </div>
            </div>
        </div>
        <div class="yy-screen-footer">
            <div class="yy-screen-footer_company"></div>
            <div class="yy-screen-footer_text marquee" id="scrollText">
                <pre>请保持安静，为了您和他人的健康,请勿在医院内吸烟!</pre>
                <pre>请保持安静，为了您和他人的健康,请勿在医院内吸烟!</pre>
            </div>
        </div>
    </div>

    <div id="yy-screen-just-call" style="display: none;">
        <div class="yy-screen-just-call__message"></div>
    </div>
</body>
</html>